<template>
  <div>
    <!-- 车主详细信息 -->
    <div class="detail_main">
      <div class="detail_top">
        <h2>基本信息</h2>
      </div>
      <div class="detail_containter">
        <FormPanel ref="FormPanel1" :list="formList1" formType="add" :isSubmitBtn="false" :labelWidth="85" :cols="3" @formChange="changeHandle1" />
      </div>
    </div>
    <div v-if="fromType == '11901002'" class="detail_main">
      <div class="detail_top">
        <h2>附加信息</h2>
      </div>
      <div class="detail_containter">
        <FormPanel ref="FormPanel2" :list="formList2" formType="add" :isSubmitBtn="false" :labelWidth="85" :cols="3" @formChange="changeHandle2" />
      </div>
    </div>
    <div v-if="fromType == '11901001'" class="detail_main">
      <div class="detail_top">
        <h2>附加信息</h2>
      </div>
      <div class="detail_containter">
        <FormPanel ref="FormPanel2s" :list="formList2s" formType="add" :isSubmitBtn="false" :labelWidth="85" :cols="3" @formChange="changeHandle2s" />
      </div>
    </div>
    <div class="detail_main">
      <div class="detail_top">
        <h2>联系人信息</h2>
      </div>
      <div class="detail_containter">
        <FormPanel ref="FormPanel3" :list="formList3" formType="add" :isSubmitBtn="false" :labelWidth="85" :cols="3" @formChange="changeHandle3" />
      </div>
    </div>
    <div class="detail_main">
      <div class="detail_top">
        <h2>备注</h2>
      </div>
      <div class="detail_containter" style="height:60px">
        <FormPanel ref="FormPanel4" :list="formList4" formType="add" :isSubmitBtn="false" :labelWidth="85" :cols="3" @formChange="changeHandle4" />
      </div>
    </div>
    <div
      :style="{
        textAlign: 'right'
      }"
    >
      <el-button @click="confirmHandle">确 定</el-button>
      <el-button @click="closeDialog">取 消</el-button>
    </div>
  </div>
</template>
<script>
import { setowner } from '@/api/repair/repairReception/evaluation/index';
import { dictionary } from '@/utils/dictMixin';
export default {
  mixins: [dictionary],
  props: ['type'],
  data() {
    return {
      fromType: '11901002',
      formList1: this.createTop1(),
      formList2: this.createTop2(),
      formList2s: this.createTop2s(),
      formList3: this.createTop3(),
      formList4: this.createTop4(),
      address1: {
        list1: [],
        list2: [],
        list3: []
      },
      address2: {
        list1: this.createRegionList(),
        list2: [],
        list3: []
      },
      fromData1: {},
      fromData2: {},
      fromData2s: {},
      fromData3: {},
      fromData4: {}
    };
  },
  watch: {
    type: function(val) {
      this.fromType = val;
      console.log(val, '变化了');
    }
  },
  methods: {
    createTop1() {
      let that = this;
      return [
        {
          type: 'INPUT',
          label: '车主编号',
          fieldName: 'OWNER_NO',
          initialValue: ''
        },
        {
          type: 'INPUT',
          label: '车主姓名',
          fieldName: 'OWNER_NAME',
          initialValue: '',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '车主拼音',
          fieldName: 'OWNER_SPELL',
          initialValue: '',
          disabled: true
        },
        {
          type: 'SELECT',
          label: '性别',
          fieldName: 'GENDER',
          initialValue: '',
          itemList: this.createDictList('1006'),
          rules: [{ required: true, message: '请输入', trigger: 'change' }]
        },
        {
          type: 'SELECT',
          label: '证件类型',
          fieldName: 'CT_CODE',
          initialValue: '',
          itemList: this.createDictList('1239')
        },
        {
          type: 'INPUT',
          label: '证件号码',
          fieldName: 'CERTIFICATE_NO',
          initialValue: ''
        },
        {
          type: 'SELECT',
          label: '所在省份',
          fieldName: 'PROVINCE',
          initialValue: '',
          itemList: this.createRegionList(),
          rules: [{ required: true, message: '请输入', trigger: 'change' }],
          change: props => this.changeProvince1(props)
        },
        {
          type: 'SELECT',
          label: '城市',
          fieldName: 'CITY',
          initialValue: '',
          itemList: [],
          rules: [{ required: true, message: '请输入', trigger: 'change' }],
          change: props => this.changeProvince2(props)
        },
        {
          type: 'SELECT',
          label: '区县',
          fieldName: 'DISTRICT',
          initialValue: '',
          itemList: [],
          rules: [{ required: true, message: '请输入', trigger: 'change' }]
        },
        {
          type: 'TEXT_AREA',
          label: '地址',
          fieldName: 'ADDRESS',
          initialValue: ''
        },
        {
          type: 'INPUT',
          label: '邮编',
          fieldName: 'ZIP_CODE',
          initialValue: '',
          rules: [{ required: true, message: '请输入', trigger: 'change' }]
        },
        {
          type: 'SELECT',
          label: '行业大类',
          fieldName: 'INDUSTRY_FIRST',
          initialValue: '',
          itemList: this.createDictList('3001')
        },
        {
          type: 'SELECT',
          label: '行业小类',
          fieldName: 'INDUSTRY_SECOND',
          initialValue: '',
          itemList: this.createDictList('3002')
        },
        {
          type: 'INPUT',
          label: '税号',
          fieldName: 'TAX_NO',
          initialValue: ''
        },
        {
          type: 'INPUT',
          label: '预收款',
          fieldName: 'PRE_PAY',
          initialValue: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '欠款金额',
          fieldName: 'ARREARAGE_AMOUNT',
          initialValue: '',
          disabled: true
        },
        {
          type: 'SELECT',
          label: '客户收款类别',
          fieldName: 'CUS_RECEIVE_SORT',
          initialValue: '',
          itemList: this.createDictList('1378')
        }
      ];
    },
    createTop2() {
      return [
        {
          type: 'TEXT_AREA',
          label: '地址二',
          fieldName: 'SECOND_ADDRESS'
        },
        {
          type: 'INPUT',
          label: '电话',
          fieldName: 'PHONE',
          initialValue: ''
        },
        {
          type: 'INPUT',
          label: 'E-Mail',
          fieldName: 'E_MAIL',
          initialValue: '',
          disabled: true
        },
        {
          type: 'DATE',
          label: '生日',
          fieldName: 'BIRTHDAY'
        },
        {
          type: 'INPUT',
          label: '手机',
          fieldName: 'MOBILE',
          initialValue: '',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '家庭月收入',
          fieldName: 'FAMILY_INCOME',
          initialValue: '',
          itemList: this.createDictList('1343')
        },
        {
          type: 'SELECT',
          label: '爱好',
          fieldName: 'HOBBY',
          initialValue: '',
          itemList: this.createDictList('1117')
        },
        {
          type: 'SELECT',
          label: '婚姻状况',
          fieldName: 'OWNER_MARRIAGE',
          initialValue: '',
          itemList: this.createDictList('1119')
        },
        {
          type: 'SELECT',
          label: '学历',
          fieldName: 'EDU_LEVEL',
          initialValue: '',
          itemList: this.createDictList('1116')
        }
      ];
    },
    createTop2s() {
      return [
        {
          type: 'INPUT',
          label: '姓名',
          fieldName: 'DECISION_MARKER_NAME'
        },
        {
          type: 'SELECT',
          label: '性别',
          fieldName: 'DECISION_MARKER_GENDER',
          initialValue: '',
          itemList: this.createDictList('1006')
        },
        {
          type: 'DATE',
          label: '生日',
          fieldName: 'DECISION_MARKER_BIRTHDAY'
        },
        {
          type: 'INPUT',
          label: '手机',
          fieldName: 'DECISION_MARKER_MOBILE',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '电话',
          fieldName: 'DECISION_MARKER_PHONE'
        },
        {
          type: 'INPUT',
          label: 'E-Mail',
          fieldName: 'DECISION_MARKER_E_MAIL',
          initialValue: ''
        },
        {
          type: 'TEXT_AREA',
          label: '地址',
          fieldName: 'DECISION_MARKER_ADDRESS'
        },
        {
          type: 'SELECT',
          label: '爱好',
          fieldName: 'HOBBY',
          initialValue: '',
          itemList: this.createDictList('1117')
        }
      ];
    },
    createTop3() {
      return [
        {
          type: 'INPUT',
          label: '姓名',
          fieldName: 'CONTACTOR_NAME',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '性别',
          fieldName: 'CONTACTOR_GENDER',
          initialValue: '',
          itemList: this.createDictList('1006'),
          rules: [{ required: true, message: '请输入', trigger: 'change' }]
        },
        {
          type: 'INPUT',
          label: '电话',
          fieldName: 'CONTACTOR_PHONE',
          initialValue: '',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: 'E-Mail',
          fieldName: 'CONTACTOR_EMAIL'
        },
        {
          type: 'INPUT',
          label: '传真',
          fieldName: 'CONTACTOR_FAX',
          initialValue: ''
        },
        {
          type: 'INPUT',
          label: '手机',
          fieldName: 'CONTACTOR_MOBILE',
          initialValue: '',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '所在省份',
          fieldName: 'CONTACTOR_PROVINCE',
          initialValue: '',
          itemList: this.createRegionList(),
          change: props => this.changeProvince3(props)
        },
        {
          type: 'SELECT',
          label: '城市',
          fieldName: 'CONTACTOR_CITY',
          initialValue: '',
          itemList: [],
          change: props => this.changeProvince4(props)
        },
        {
          type: 'SELECT',
          label: '区县',
          fieldName: 'CONTACTOR_DISTRICT',
          initialValue: '',
          itemList: []
        },
        {
          type: 'TEXT_AREA',
          label: '地址',
          fieldName: 'CONTACTOR_ADDRESS',
          initialValue: '',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '邮编',
          fieldName: 'CONTACTOR_ZIP_CODE',
          initialValue: ''
        },
        {
          type: 'SELECT',
          label: '喜欢的联络方式',
          fieldName: 'CONTACTOR_HOBBY_CONTACT',
          initialValue: '',
          itemList: this.createDictList('1331')
        },
        {
          type: 'SELECT',
          label: '职业',
          fieldName: 'CONTACTOR_VOCATION_TYPE',
          initialValue: '',
          itemList: this.createDictList('1111')
        },
        {
          type: 'SELECT',
          label: '职称',
          fieldName: 'CONTACTOR_POSITION',
          initialValue: '',
          itemList: this.createDictList('1110')
        }
      ];
    },
    createTop4() {
      return [
        {
          type: 'TEXT_AREA',
          label: '备注',
          fieldName: 'REMARK'
        }
      ];
    },
    changeHandle1(val) {
      console.log(val);
      this.fromData1 = val;
    },
    changeHandle2(val) {
      console.log(val);
      this.fromData2 = val;
    },
    changeHandle2s(val) {
      console.log(val);
      this.fromData2s = val;
    },
    changeHandle3(val) {
      console.log(val);
      this.fromData3 = val;
    },
    changeHandle4(val) {
      console.log(val);
      this.fromData4 = val;
    },
    // 改变第一个省份
    changeProvince1(val) {
      console.log(val, '11111111');
      let arr = this.createRegionList();
      for (let i = 0; i < arr.length; i++) {
        if (arr[i].value == val) {
          let arrays = this.jsonchangelist(arr[i].children);
          this.address1.list2 = arrays;
          this.formList1[7].itemList = arrays;
          this.formList1[8].itemList = [];
          this.formList1[8].initialValue = '';
        }
      }
    },
    changeProvince2(val) {
      console.log(val, '11111111');
      let arr = this.address1.list2;
      for (let i = 0; i < arr.length; i++) {
        if (arr[i].value == val) {
          console.log(this.jsonchangelist(arr[i].children), arr[i].children, '1');
          let arrays = this.jsonchangelist(arr[i].children);
          this.address1.list3 = arrays;
          this.formList1[8].itemList = arrays;
        }
      }
    },
    jsonchangelist(json) {
      let arr = [];

      for (let i in json) {
        if (!json[i].children) {
          arr.push({ text: json[i].region_name, value: json[i].region_id });
        } else {
          arr.push({ text: json[i].region_name, value: json[i].region_id, children: json[i].children });
        }
      }
      return arr;
    },
    changeProvince3(val) {
      console.log(val, '11111111');
      let arr = this.createRegionList();
      for (let i = 0; i < arr.length; i++) {
        if (arr[i].value == val) {
          let arrays = this.jsonchangelist(arr[i].children);
          this.address2.list2 = arrays;
          this.formList2[7].itemList = arrays;
          this.formList2[8].itemList = [];
          this.formList2[8].initialValue = '';
        }
      }
    },
    changeProvince4(val) {
      console.log(val, '11111111');
      let arr = this.address2.list2;
      for (let i = 0; i < arr.length; i++) {
        if (arr[i].value == val) {
          console.log(this.jsonchangelist(arr[i].children), arr[i].children, '1');
          let arrays = this.jsonchangelist(arr[i].children);
          this.address2.list3 = arrays;
          this.formList2[8].itemList = arrays;
        }
      }
    },
    confirmHandle() {
      this.$refs.FormPanel1.SUBMIT_FORM();
      if (this.fromType == '11901002') {
        this.$refs.FormPanel2.SUBMIT_FORM();
      } else {
        this.$refs.FormPanel2s.SUBMIT_FORM();
      }
      this.$refs.FormPanel3.SUBMIT_FORM();
      this.$refs.FormPanel4.SUBMIT_FORM();
      let fromType = this.fromType;
      let data = Object.assign({}, this.fromData1, this.fromData2, this.fromData3, this.fromData4, this.fromData2s);
      console.log(data, fromType);
      this.$confirm('是否确定保存？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          console.log(this.fromData1, this.fromData2, this.fromData3, this.fromData4, this.fromData2s);
          console.log(this.fromData1 != null, this.fromData2 != null, this.fromData3 != null, this.fromData4 != null, this.fromData2s != null);
          if (this.fromData1 != null && this.fromData2 != null && this.fromData3 != null && this.fromData4 != null && this.fromData2s != null) {
            let json = {
              ownerProperty: fromType,
              ownerNo: data.OWNER_NO,
              ownerName: data.OWNER_NAME,
              ownerSpell: data.OWNER_SPELL,
              gender: data.GENDER,
              ctCode: data.CT_CODE || null,
              certificateNo: data.CERTIFICATE_NO,
              province: data.PROVINCE,
              city: data.CITY,
              district: data.DISTRICT,
              address: data.ADDRESS,
              zipCode: data.ZIP_CODE,
              industryFirst: data.INDUSTRY_FIRST,
              industrySecond: data.INDUSTRY_SECOND,
              taxNo: data.TAX_NO,
              prePay: data.PRE_PAY,
              arrearageAmount: data.ARREARAGE_AMOUNT,
              cusReceiveSort: data.CUS_RECEIVE_SORT,
              decisionMarkerName: data.DECISION_MARKER_NAME,
              decisionMarkerGender: data.DECISION_MARKER_GENDER,
              decisionMarkerBirthday: data.DECISION_MARKER_BIRTHDAY,
              decisionMarkerMobile: data.DECISION_MARKER_MOBILE,
              decisionMarkerPhone: data.DECISION_MARKER_PHONE,
              decisionMarkerEMail: data.DECISION_MARKER_E_MAIL,
              decisionMarkerAddress: data.DECISION_MARKER_ADDRESS,
              secondAddress: data.SECOND_ADDRESS,
              phone: data.PHONE,
              email: data.E_MAIL,
              birthday: data.BIRTHDAY,
              mobile: data.MOBILE,
              familyIncome: data.FAMILY_INCOME,
              ownerMarriage: data.OWNER_MARRIAGE,
              eduLevel: data.EDU_LEVEL,
              contactorName: data.CONTACTOR_NAME,
              contactorGender: data.CONTACTOR_GENDER,
              contactorPhone: data.CONTACTOR_PHONE,
              contactorEmail: data.CONTACTOR_EMAIL,
              contactorFax: data.CONTACTOR_FAX,
              contactorMobile: data.CONTACTOR_MOBILE,
              contactorProvince: data.CONTACTOR_PROVINCE,
              contactorCity: data.CONTACTOR_CITY,
              contactorDistrict: data.CONTACTOR_DISTRICT,
              contactorAddress: data.CONTACTOR_ADDRESS,
              contactorZipCode: data.CONTACTOR_ZIP_CODE,
              contactorHobbyContact: data.CONTACTOR_HOBBY_CONTACT,
              contactVocationType: data.CONTACTOR_VOCATION_TYPE,
              contactorPosition: data.CONTACTOR_POSITION,
              remark: data.REMARK
            };

            console.log(json, '提交数据');
            setowner(json);
            this.$emit('closeOwnerFun', false);
          }
        })
        .catch(() => {
          // this.$notify.info({title: '提示信息',message:'已取消删除'});
        });
    },
    closeDialog() {
      this.$emit('closeOwnerFun', false);
    }
  }
};
</script>
<style lang="less" scoped>
.detail_main {
  border: 1px solid #ebeef5;
  margin-bottom: 10px;
  .detail_top {
    background: #f2f2f2;
    border-bottom: 1px solid #ebeef5;
    height: 25px;
    line-height: 25px;
    padding: 0 10px;
  }
  .detail_containter {
    padding-top: 10px;
  }
}
</style>
